import {useEffect} from 'react';
import {connect} from 'react-redux';
import {View, ScrollView} from '@tarojs/components';
import {AtIcon, AtTabs, AtTabsPane} from 'taro-ui';
import {Dialog, Empty, Loading, Overlay} from '@nutui/nutui-react-taro'
import Order from './bookOrderCard';

function Orders(props) {
    const {dispatch, bookOrderList = []} = props;
    console.log('bookOrderList', bookOrderList);
    useEffect(() => {
        dispatch({
            type: 'order/loadBookOrder'
        })
    }, []);
    function deleteOrder (cur) {
        console.log('cru', cur);
        dispatch({
            type: 'order/deleteBookOrder',
            payload: {
                id: cur?.id
            }
        })
    }
  // const tabList = [{title: '全部'}, {title: '生效中'}, {title: '已取消'}, {title: '已超时'}];
    return (
        <View className='orders'>
            <Dialog id="test" />
            <View className='orderWrap'>
                {bookOrderList.length ? bookOrderList.map((i) => <Order order={i} deleteOrder={deleteOrder}/>) :
                <Empty description='暂无预约记录' style={{backgroundColor: 'transparent', paddingTop: '100rpx'}}/>}
            </View>
        </View>
    )
}

export default connect((
  {
    order,
    loading: {effects: {"order/loadMore": loading = false} = {}} = {},
  } = {}
) => {
    return {
      ...order,
      loading
    }
})(Orders)
